<template>
	<view class="notice">
		
		<view class="list">
			<view class="list-item" v-for="(item, index) in dataList" :key="index">
				<view class="flex flex-direction">
					<view class="title">{{item.title || ''}}</view>
					<view class="content">{{item.content || ''}}</view>
				</view>
				
				<view class="time">{{item.createtime || ''}}</view>
			</view>
		</view>
		
		<!-- 更多 -->
		<uni-load-more :status="status" :content-text="contentText" />
		
	</view>
</template>

<script>
import { mapState, mapActions } from 'vuex';
export default {
	data() {
		return {
			modalName: null,
			listTouchStart: 0,
			listTouchDirection: null,
			dataList:[],
			current_page: 1, //当前页码
			last_page: 1, //总页码
			status: 'noMore',//noMore loading
			contentText: {
				contentdown: '',
				contentrefresh: '正在加载...',
				contentnomore: ''
			}
		};
	},
	computed: {
		...mapState(['chat','statistics'])
	},
	// 触底加载更多
	onReachBottom() {
		if (this.currentPage < this.lastPage) {
			this.currentPage += 1;
			this.getList();
		}
	},
	onLoad(){
		this.getList();
	},
	methods: {
		...mapActions({
			del: 'chat/del', // 删除消息记录
			empty: 'chat/empty', // 清空角标
		}),
		ListTouchStart(e) {
			this.listTouchStart = e.touches[0].pageX
		},
		ListTouchMove(e) {
			this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > 0 ? 'right' : 'left'
		},
		ListTouchEnd(e) {
			if (this.listTouchDirection == 'left') {
				this.modalName = e.currentTarget.dataset.target
			} else {
				this.modalName = null
			}
			this.listTouchDirection = null
		},
		getList() {
			let that = this;
			this.status = 'loading';
			uni.request({
				url: '/index/noticelist',
				data: {
					page: this.current_page,
				},
				success: res => {
					res = res.res
					if (res.code === 1) {
						that.dataList = [...that.dataList, ...res.data.data];
						that.current_page = res.data.current_page; //当前页码
						that.last_page = res.data.last_page; //总页码
						that.status = 'more';
					}
				}
			});
		
		}
	}
};
</script>

<style lang="scss" scoped>
.cu-bar .search-form{
	background-color: #f2f2f2;
}
/* #ifdef MP */
.cu-bar .search-form{
	margin: 0 0 0 25rpx;
}
/* #endif */

.list{
	margin: 20rpx 26rpx 0rpx 26rpx;
	
	.list-item{
		margin-bottom: 20rpx;
		border-radius: 16rpx;
		padding: 26rpx;
		background-color: #ffffff;
	}
	
	.title{
		font-size: 30rpx;
		font-weight: 700;
	}
	
	.content{
		margin-top: 16rpx;
		font-size: 26rpx;
	}
	
	.time{
		color: #969696;
		font-size: 24rpx;
		margin-top: 16rpx;
	}
}
</style>